<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>Control de condominios</title>
            </f:facet>
        </h:head>

        <h:body>

            <p:layout fullPage="true">

                <p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
                    Control de condominios
                </p:layoutUnit>

                <p:layoutUnit position="south" size="100" closable="true" collapsible="true">
                    
                    <h:form id="form">  
                  
                    <br />  
  
    <p:commandButton id="carBtn" value="Ingresar Apto." type="button" />  
  
    <p:overlayPanel id="carPanel" for="carBtn" hideEffect="fade" dynamic="true">  
        <p:dataTable id="table" var="car" value="#{tableBean.cars}" rows="10" paginator="true">  
            
            <p:column headerText="">  
                <h:outputText value="#{car.model}" />  
            </p:column>  
  
            <p:column headerText="Year">  
                <h:outputText value="#{car.year}" />  
            </p:column>  
  
            <p:column headerText="Manufacturer">  
                <h:outputText value="#{car.manufacturer}" />  
            </p:column>  
  
            <p:column headerText="Color">  
                <h:outputText value="#{car.color}" />  
            </p:column>  
        </p:dataTable>  
    </p:overlayPanel>  
  
    <br /><br />  
  
    <p:graphicImage id="img" value="../images/images.png" style="cursor:pointer"/>  
  
    <p:overlayPanel id="imgPanel" for="img" showEffect="blind" hideEffect="explode" showEvent="mouseover" hideEvent="mousedown"  
            styleClass="ui-helper-clearfix">  
        <p:imageSwitch id="imgSwitch" effect="fade">  
            <ui:repeat value="#{imageSwitchBean.images}" var="image">  
                <p:graphicImage value="/images/#{image}" width="300"/>  
            </ui:repeat>  
        </p:imageSwitch>  
    </p:overlayPanel>  
</h:form>                   
                    
                    
                </p:layoutUnit>

                <p:layoutUnit position="west" size="175" header="Ocultar" collapsible="true">
                    <p:menu>
                        <p:submenu label="Condominios">
                            <p:menuitem value="Condominio 1" url="#"/>
                            <p:menuitem value="Condominio 2" url="#"/>
                            <p:menuitem value="Condominio 3" url="#"/>
                        </p:submenu>

                    </p:menu>
                </p:layoutUnit>

                <p:layoutUnit position="center">
                    
                    
            
            <h:dataTable value="#{alumnosBean.model}" var="alumno" border="0" cellpadding="2" cellspacing="0" rowClasses="jsfcrud_odd_row,jsfcrud_even_row" rules="all" style="border:solid 1px">
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Propietario"/>
                    </f:facet>
                    <h:outputText value="#{alumno.id}"/>
                </h:column>

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Tel. Propietario"/>
                    </f:facet>
                    <h:outputText value="#{alumno.carnet}"/>
                </h:column>

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Correo Propietario"/>
                    </f:facet>
                    <h:outputText value="#{alumno.nombres}"/>
                </h:column>

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Inquilino"/>
                    </f:facet>
                    <h:outputText value="#{alumno.apellidos}"/>
                </h:column>

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Tel. Inquilino"/>
                    </f:facet>
                    <h:outputText value="#{alumno.correo}"/>
                </h:column>

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Correo Inquilino"/>
                    </f:facet>
                    <h:outputText value="#{alumno.correo}"/>
                </h:column>
                
            </h:dataTable>

                    
                </p:layoutUnit>

            </p:layout>

        </h:body>

    </f:view>
</html>

